<template>

  <div>

    <!-- 面包屑导航条 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>工艺管理</el-breadcrumb-item>
      <el-breadcrumb-item>工艺列表</el-breadcrumb-item>
    </el-breadcrumb>



    <el-card class="box-card">


      <el-form :model="searchForm" label-width="70px">
        <el-row>
          <el-col :span="6">
            <el-form-item label="关键字">
              <el-input v-model="searchForm.code" style="width: 200px"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-button type="primary" @click="searchList()">搜索</el-button>
<!--            <el-button type="primary" @click="entryOrder">添加</el-button>-->
          </el-col>
        </el-row>
      </el-form>



      <el-table
        :data="gyList"
        stripe
        style="width: 100%">
        <el-table-column
          prop="code"
          label="工艺编号"
          width="180">
        </el-table-column>
        <el-table-column prop="userName" label="销售员" width="180">
<!--          <template slot-scope="scope">-->
<!--            {{scope.row.userName}}-->
<!--          </template>-->
        </el-table-column>

        <el-table-column prop="createDate" label="创建时间">
          <template slot-scope="scope">
            {{scope.row.createDate | datefmt('YYYY-MM-DD HH:mm:ss')}}
          </template>
        </el-table-column>
        <el-table-column prop="updateDate" label="更新时间">
          <template slot-scope="scope">
            {{scope.row.updateDate | datefmt('YYYY-MM-DD HH:mm:ss')}}
          </template>
        </el-table-column>
        <el-table-column prop="state" label="订单状态">
          <template slot-scope="scope">
            {{scope.row.state | gyFit}}
          </template>
        </el-table-column>
        <el-table-column
          fixed="right"
          label="操作"
          width="100">
          <template slot-scope="scope">
            <el-dropdown>
              <span class="el-dropdown-link">
                <i class="el-icon-arrow-down el-icon--right"></i>
              </span>
              <el-dropdown-menu slot="dropdown">
                <el-button type="primary" @click="GyDetail(scope.row.id,scope.row.code)">查看</el-button>
                <el-button type="primary" v-if="scope.row.state==1" @click="commitOrders1(scope.row.id)">提交</el-button>
                <el-button type="primary" v-if="scope.row.state==2" @click="commitOrders2(scope.row.id)">已工艺</el-button>
              </el-dropdown-menu>
            </el-dropdown>
          </template>
        </el-table-column>
      </el-table>
      <!-- 分页-->
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="page.currentPage"
        :page-sizes="[3, 5, 10, 20]"
        :page-size="page.pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
      </el-pagination>


    </el-card>

  </div>

</template>

<script>
    export default {
        name: "OrderList",
      data(){
          return{
            searchForm:{},
            gyList:[],
            page: {
              currentPage: 0,
              pageSize: 5
            },
            total:0

          }

      },
      methods:{
        searchList(){
          this.$http.post("/gy/list/"+this.page.currentPage+"/"+this.page.pageSize,this.searchForm).then((res)=>{

            this.gyList=res.data.result.list;
            console.info(this.gyList);
            this.total=res.data.result.total;
          })

        },
        handleSizeChange(val) {
          this.page.pageSize=val;
          this.searchList();
        },
        handleCurrentChange(val) {
          this.page.currentPage=val;
          this.searchList();
        },
        GyDetail:function (id,itemId) {
          this.$router.push({ path: "/gyDetail?id="+id });

          sessionStorage.setItem("itemId",itemId);
        },
        commitOrders1(id){
          debugger;
          this.$http.get("/gy/find1/"+id).then((res)=>{
            if(res.data.success){
              alert(res.data.message);
            }else{
              alert(res.data.message);
            }

            //this.$message(res.data.message);
          });
          window.location.reload();
        },
        commitOrders2(id){
          // this.$http.get("gy/find1/"+id).then((res)=>{
          //   this.$message(res.data.message);
          // });
          // window.location.reload();
        }
      },
      mounted() {
        this.searchList();
      },
      filters: {
          gyFit:function (val) {
            if(val=='0'){
              return '未提交';
            }
            if(val=='1'){
              return '已提交';
            }
            if(val=='2'){
              return '已工艺';
            }
            if(val=='3'){
              return '已报价';
            }
            if(val=='4'){
              return '已转合';
            }

          }
      }
    }
</script>

<style scoped>

</style>
